<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<ui:composition xmlns="http://www.w3.org/1999/xhtml"
                xmlns:h="http://java.sun.com/jsf/html"
                xmlns:p="http://primefaces.org/ui"
                xmlns:ui="http://java.sun.com/jsf/facelets"
                xmlns:f="http://java.sun.com/jsf/core"
                template="/WEB-INF/template/template.xhtml">

    <ui:define name="Content">

        <ui:param name="bean" value="#{servicoMBean}" />

        <p:fieldset legend="Editando 'Catalogo de Servicos'">
            <h:form id="view" prependId="false">
                
                <p:panel> 
                    <p:tree value="#{bean.root}" var="node" style="border: none;" id="arvore">  
                        <p:treeNode >  
                            <h:outputText value="#{node}"/>  
                        </p:treeNode>  
                    </p:tree>  

                    <f:facet name="footer">
                        <p:commandButton value="Novo" update=":panelNew"  
                                         oncomplete="popupNovo.show()" icon="ui-icon-document"
                                         global="false" action="#{bean.resetSelected()}"/>

                        <p:commandButton value="Deletar" update=":panelDelete" 
                                         oncomplete="popupDeletar.show()" icon="ui-icon-trash" />

                        <p:commandButton value="Voltar" action="/services?faces-redirect=true" 
                                         icon="ui-icon-check" global="false"/>
                    </f:facet>
                </p:panel>
                
            </h:form>
        </p:fieldset>  


        <p:dialog header="Cadastro de Serviços" id="popupNovoId" widgetVar="popupNovo" modal="true" resizable="false" 
                  draggable="false" appendToBody="true">  

            <h:form id="panelNew" prependId="false">
                <p:focus context="panelNew" />

                <h:panelGrid columns="2" cellspacing="10">  

                    <p:outputLabel for="name" value="Nome:" style="font-weight: bold"/>
                    <p:inputText label="Name" id="name" value="#{bean.selectedServico.nome}"  required="true" style="width:400px" 
                                 title="#{component.valid ? 'Enter Name' : 'Name is empty or contains invalid caracters.'}"/>

                    <p:outputLabel for="pai" value="Nó Pai:" style="font-weight: bold"/>
                    <p:selectOneMenu id="pai" value="#{bean.selectedServico.pai}" required="true" style="width:400px" 
                                     title="#{component.valid ? 'Enter Nó-Pai' : 'Nó-Pai is empty or contains invalid caracters.'}" >

                        <f:selectItem itemLabel="Selecione..." />
                        <f:selectItems value="#{bean.servicosCadastrar}"  />
                    </p:selectOneMenu> 

                    <f:facet name="footer">
                        <p:commandButton value="Cadastrar" action="#{bean.insert}" 
                                         icon="ui-icon-check" update=":panelNew :view" 
                                         oncomplete="hideDialog(xhr, status, args, popupNovo)" />

                        <p:commandButton value="Cancelar" onsuccess="popupNovo.hide()"  
                                         icon="ui-icon-cancel" process="@this" global="false"/>
                    </f:facet>

                </h:panelGrid>

            </h:form>
        </p:dialog>  

        <p:dialog header="Delecao de Serviços" widgetVar="popupDeletar" modal="true" resizable="false" 
                  draggable="false" appendToBody="true">  

            <h:form id="panelDelete" prependId="false">
                <p:focus context="panelDelete" />

                <h:panelGrid columns="2" cellspacing="10" >  

                    <p:outputLabel for="deletar" value="Nó:" style="font-weight: bold"/>
                    <p:selectOneMenu id="deletar" value="#{bean.selectedServico.id}" required="true" 
                                     requiredMessage="Select value to delete." style="width: 400px">
                        <f:selectItem itemLabel="Selecione..." />
                        <f:selectItems value="#{bean.servicosDeletar}"  />
                    </p:selectOneMenu> 

                    <f:facet name="footer">
                        <p:commandButton value="Deletar" oncomplete="showDialog(xhr, status, args, deleteConfirm)"
                                         icon="ui-icon-trash" update=":panelDelete" />

                        <p:commandButton value="Cancelar" onsuccess="popupDeletar.hide()" 
                                         icon="ui-icon-cancel" update=":view" process="@this" global="false"/>
                    </f:facet>

                </h:panelGrid>

            </h:form>
        </p:dialog>

        <p:confirmDialog id="deleteConfirmId" message="Are you sure you want to remove this?" 
                         header="Confirmation" widgetVar="deleteConfirm" appendToBody="true" severity="alert">
            <h:form>
                <p:commandButton value="No" oncomplete="deleteConfirm.hide()" 
                                 icon="ui-icon-cancel" global="false" style="float: right;"/>

                <p:commandButton value="Yes" update=":view :panelDelete" oncomplete="deleteConfirm.hide()" 
                                 action="#{bean.delete}" icon="ui-icon-check" style="float: right;"/>
            </h:form>
        </p:confirmDialog>


    </ui:define>
</ui:composition>